<template>
  <div>
    <van-form @submit="onSubmit">
      <van-field
        v-model="phone"
        name="手机号"
        label="手机号"
        placeholder="手机号"
        :rules="[{ required: true, message: '请填写手机号' }]"
      />
      <van-field
        v-model="vccode"
        type="number"
        name="验证码"
        label="验证码"
        placeholder="验证码"
        :rules="[{ required: true, message: '请填写验证码' }]"
      >
        <template #button>
          <van-button type="info" @click="getCaptcha">获取验证码</van-button>
        </template>
      </van-field>

      <div style="margin: 16px">
        <van-button round block type="info" native-type="submit"
          >提交</van-button
        >
      </div>
    </van-form>
  </div>
</template>

<script>
import { Toast } from "vant";
export default {
  data() {
    return {
      phone: "",
      vccode: "",
    };
  },
  methods: {
    onSubmit(values) {
      //   console.log("submit", values);
      this.$axios({
        url: "http://121.196.235.163:3000/captcha/verify",
        method: "get",
        params: { phone: this.phone, captcha: this.vccode },
      }).then((res) => {
        console.log(res);
        if (res.data.code == 200) {
          Toast.success("恭喜您登陆成功");
          this.$router.push({ name: "mine" });
        } else {
          Toast.fail("校验失败");
        }
      });
    },
    getCaptcha() {
      this.$axios({
        url: "http://localhost:2800/users",
        method: "get",
        params: { phone: this.phone },
      }).then((res) => {
        if (res.data.length > 0) {
          //注册过
          this.$axios({
            url: "http://121.196.235.163:3000/captcha/sent",
            method: "get",
            params: { phone: this.phone },
          }).then((res) => {
            if (res.data.code == 200) {
              Toast.success("验证码已发送");
            } else {
              Toast.fail("验证码发送失败");
            }
          });
        } else {
          //未注册
          Toast.fail("您的手机号还未注册，请先去注册");
        }
      });
    },


  },
};
</script>

<style></style>
